<template>
  <basic-container>
    <div>
      <el-card class="box-card">
        <div slot="header" class="clearfix">
          <h3>订单详情</h3>
          <span>订单详情</span>
        </div>
        <!-- 订单信息和用户信息 -->
        <avue-detail ref="form" v-model="form" :option="formOption"></avue-detail>
        <!-- 数据表单 -->
        <avue-crud
          :data="tableData"
          :option="option"
          @size-change="sizeChange"
          @current-change="currentChange"
        >
          <template slot="menu" slot-scope="scope">
            
            <el-dropdown>
              <el-button type="text">
                同意退货
              </el-button>
              <el-button type="text">同意退款</el-button>
            </el-dropdown>
          </template>
        </avue-crud>
      </el-card>
    </div>
  </basic-container>
</template>
<script>
// 上面现实的订单信息和用户信息
import { formOption } from "../../const/crud/supply/supply_order";

// 下面请求到的数据
import { tableOption } from "../../const/crud/supply/order_details";
import { orderDetails } from "../../api/supply/order_details";
export default {
  data() {
    return {
      form: {},
      tableData: [],
      option: tableOption,
      formOption: formOption,
    };
  },
  mounted() {
    this.getorderDetails();
  },
  methods: {
    getorderDetails() {
      orderDetails(this.$route.query.shipRecordSn).then(res => {
        this.tableData = res.data.data.detailList;
        this.form = res.data.data;
      });
    },
    sizeChange(val) {
      this.page.currentPage = 1;
      this.page.pageSize = val;
      this.orderDetails();
      this.$message.success("行数" + val);
    },
    currentChange(val) {
      this.page.currentPage = val;
      this.orderDetails();
      this.$message.success("页码" + val);
    }
  }
};
</script>
<style lang="less" scoped>
</style>